let div=$('div');

// 鼠标单击时触发；
div.click(function(){
    console.log('我被点击了');
})

/* mouseenter：鼠标进入时触发 */
div.mouseenter(function(){
    console.log('我进来了');
})

/* mouseleave：鼠标移出时触发 */
div.mouseleave(function(){
    console.log('我出来了');
})

/* mousemove：鼠标在DOM内部移动时触发 */
div.mousemove(function(){
    console.log('我在里面移动');
})

/* ======================================================================================================= */


var
    form = $('#test-form'),
    langs = form.find('[name=lang]'),
    selectAll = form.find('label.selectAll :checkbox'),
    selectAllLabel = form.find('label.selectAll span.selectAll'),
    deselectAllLabel = form.find('label.selectAll span.deselectAll'),
    invertSelect = form.find('a.invertSelect');

    selectAllLabel.show();
    deselectAllLabel.hide();
// 当用户勾上“全选”时，自动选中所有语言，并把“全选”变成“全不选”；
selectAll.change(function () {
    if(this.checked){
        langs.prop('checked',true)
        selectAllLabel.hide();
        deselectAllLabel.show();
    }else{
        langs.prop('checked',false) // 当用户去掉“全不选”时，自动不选中所有语言；
        selectAllLabel.show();
        deselectAllLabel.hide();
    }

    

});   


// 当用户点击“反选”时，自动把所有语言状态反转（选中的变为未选，未选的变为选中）；
console.log(invertSelect);
invertSelect.click(function(){
    // console.log('我被点击了');
    for(let i=0;i<langs.length;i++)
    {
        if (langs[0].checked==false && langs[1].checked==false && langs[2].checked==false && langs[3].checked==false && langs[4].checked==false) {
            langs.prop('checked',true)
            selectAll.prop('checked',true)
            selectAllLabel.hide();
            deselectAllLabel.show();
        }else{
            langs.prop('checked',false)
            selectAll.prop('checked',false)
            selectAllLabel.show();
            deselectAllLabel.hide();
        }
    
    }
    //逻辑未处理完。。。。
})
// 当用户把所有语言都手动勾上时，“全选”被自动勾上，并变为“全不选”；

    for(let i=0;i<langs.length;i++)
    {
        langs[i].onclick=function(){
            if(langs[0].checked==true && langs[1].checked==true && langs[2].checked==true && langs[3].checked==true && langs[4].checked==true){
                selectAll.prop('checked',true)
                selectAllLabel.hide();
                deselectAllLabel.show();
            }else{
                selectAll.prop('checked',false) // 当用户手动去掉选中至少一种语言时，“全不选”自动被去掉选中，并变为“全选”。
                selectAllLabel.show();
                deselectAllLabel.hide();
            }
        }
    }
/* ======================================================================================================= */
// 除了列出的3种语言外，请再添加Pascal、Lua和Ruby，然后按字母顺序排序节点：
let ul=$('#test-div>ul')
ul.append('<li><span>Pascal</span></li>')
ul.append('<li><span>Lua</span></li>')
ul.append('<li><span>Ruby</span></li>')
let li=$('li')
let arr=[];
li.remove(); //删除li节点
for(let i=0;i<li.length;i++)
{
     arr.push(li[i].innerText)
}
arr.sort();
console.log(arr);
for(let i=0;i<arr.length;i++)
{
     ul.append('<li><span>'+arr[i]+'</span></li>')
}




// 测试:
;(function () {
    var s = $('#test-div>ul>li').map(function () {
        return $(this).text();
    }).get().join(',');
    if (s === 'JavaScript,Lua,Pascal,Python,Ruby,Swift') {
        console.log('测试通过!');
    } else {
        console.log('测试失败: ' + s);
    }
})();
